<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <link rel="icon" href="./favicon.ico" />

  <title>spine-viewer</title>

  <!--http://www.html5rocks.com/en/mobile/mobifying/-->
  <meta name="viewport"
    content="width=device-width,user-scalable=no,initial-scale=1,minimum-scale=1,maximum-scale=1,minimal-ui=true" />

  <!--https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html-->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  <meta name="format-detection" content="telephone=no">

  <!-- force webkit on 360 -->
  <meta name="renderer" content="webkit" />
  <meta name="force-rendering" content="webkit" />
  <!-- force edge on IE -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="msapplication-tap-highlight" content="no">

  <!-- force full screen on some browser -->
  <meta name="full-screen" content="yes" />
  <meta name="x5-fullscreen" content="true" />
  <meta name="360-fullscreen" content="true" />

  <!--fix fireball/issues/3568 -->
  <!--<meta name="browsermode" content="application">-->
  <meta name="x5-page-mode" content="app">

  <!--<link rel="apple-touch-icon" href=".png" />-->
  <!--<link rel="apple-touch-icon-precomposed" href=".png" />-->

  <link rel="stylesheet" type="text/css" href="style.02f4a.css" />

</head>

<body>
  <div id="GameDiv" cc_exact_fit_screen="true">
    <div id="Cocos3dGameContainer">
      <canvas id="GameCanvas" oncontextmenu="event.preventDefault()" tabindex="99"></canvas>
    </div>
  </div>
  

<!-- Polyfills bundle. -->

<script src="src/polyfills.bundle.5adbf.js" charset="utf-8"> </script>


<!-- SystemJS support. -->
<script src="src/system.bundle.543e6.js" charset="utf-8"> </script>

<!-- Import map -->
<script src="src/import-map.21c09.json" type="systemjs-importmap" charset="utf-8"> </script>

<script>
    System.import('./index.22fbb.js').catch(function(err) { console.error(err); })
</script>

  <script>
    const GameDiv = document.getElementById('GameDiv');
    ['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
      GameDiv.addEventListener(eventName, (e) => {
        e.preventDefault();
        e.stopPropagation();
      }, false);
    });
    GameDiv.addEventListener('drop', async (e) => {
      const dtItems = e.dataTransfer.items;
      const files = [];
      if (dtItems.length === 1) {
        // 按文件夹处理
        if (dtItems[0].webkitGetAsEntry().isDirectory) {
          const dirReader = dtItems[0].webkitGetAsEntry().createReader();
          await new Promise((resolve, reject) => {
            dirReader.readEntries((entries) => {
              const fileEntries = Array.from(entries).filter((entrie) => entrie.isFile);
              const filePromises = fileEntries.map((entrie) => new Promise((resolve, reject) => {
                entrie.file((file) => {
                  files.push(file);
                  resolve();
                });
              }));
              Promise.all(filePromises).then(() => {
                resolve();
              });
            });
          });
        }
      } else {
        // 按文件处理
        for (let i = 0; i < dtItems.length; i++) {
          if (!dtItems[i].webkitGetAsEntry().isDirectory) {
            const file = dtItems[i].getAsFile();
            files.push(file);
          }
        }
      }
      cc.director.emit('load_skeleton_data', files);
    }, false);
  </script>
</body>

</html>